<script setup>
import { appStockListQuery } from "@/services/cashier";
import { onLoad, onReady, onShow, onReachBottom } from "@dcloudio/uni-app";
import { nextTick, ref, watch, onMounted } from "vue";
import { appOrderQuery } from "@/services/cashier";
import { appInfo } from "@/services/user";

import {
  getToday,
  getYesterday,
  getThisWeek,
  getLastWeek,
  getThisMonth,
} from "@/utils/seldate";
const form = ref({
  pageIndex: 1,
  pageSize: 20,
  code: "",
  createStartTime: "",
  createEndTime: "",
  createBy: "",
  shopId: "",
  shopIds: [],
  keyword: "",
});
const userObj = ref({});
const num = ref(0);
const createByObj = ref({});
const showtime = ref(false);
const timevalue = ref(Date.now());
const showSelect = ref("");
const ids = ref("");
const shopName = ref("");

onReachBottom(() => {
  console.log("触底了");
  getAppProductQuery();
});

onLoad((options) => {
  ids.value = options.ids ? options.ids : "";
  shopName.value = options.shopName ? options.shopName : "";
  if (uni.getStorageSync("user")) {
    userObj.value = JSON.parse(uni.getStorageSync("user"));
  }
  if (uni.getStorageSync("selectSearch")) {
    uni.removeStorageSync("selectSearch");
  }

  if (uni.getStorageSync("selectShopType")) {
    showSelect.value = uni.getStorageSync("selectShopType");
  }

  console.log(showSelect.value);
  // options1.value = [userObj.value];
  // getAppShopSelector();
  // getAppProductQuery();
});
onShow(() => {
  if (uni.getStorageSync("selectSearch")) {
    createByObj.value = uni.getStorageSync("selectSearch");
    console.log(createByObj.value);
    form.value.createBy = createByObj.value.id;
  }
});
onReady(() => {
  // 微信小程序需要用此写法
  // datetimePickerRef.value.setFormatter(formatter);
});
const selectShow = ref(false);
const confirmDate = (e) => {
  let dateobj = new Date(e.value);
  console.log(dateobj.getFullYear(), dateobj.getMonth() + 1, dateobj.getDate());
  timevalue.value =
    dateobj.getFullYear() +
    "-" +
    (dateobj.getMonth() + 1 < 10
      ? "0" + (dateobj.getMonth() + 1)
      : dateobj.getMonth() + 1) +
    "-" +
    (dateobj.getDate() < 10 ? "0" + dateobj.getDate() : dateobj.getDate());

  showtime.value = false;

  form.value.createStartTime = timevalue.value + " 00:00:00";
  form.value.createEndTime = timevalue.value + " 23:59:59";
  selectdate.value = 6;

  // getChartBusiness();
  getAppProductQuery(1);
  // getChartProduct();
};
function open() {
  // 打开逻辑，比如设置 show 为 true
  // selectShow.value = true;
  // console.log('open');
}

const productData = ref([]);

const loading = ref("");
const getAppProductQuery = async (index) => {
  console.log("index", index);
  if (index == 1) {
    productData.value = [];
    loading.value = "";
  }
  if (index) {
    form.value.pageIndex = index;
  }
  if (loading.value == "noMore") {
    return;
  }
  loading.value = "Loading";
  console.log("form__________", showSelect.value);
  if (showSelect.value == "admin") {
  } else {
    form.value.shopIds = [];
    form.value.shopId = userObj.value.shopId;
  }
  if (ids.value) {
    form.value.shopIds = [ids.value];
  }

  try {
    let res = await appOrderQuery(form.value);
    if (res.code == 200) {
      console.log(res);
      num.value = res.data.totalCount;

      console.log(productData.value);
      form.value.pageIndex = form.value.pageIndex + 1;
      productData.value = productData.value.concat(res.data.datas);

      if (res.data.datas.length < form.value.pageSize) {
        loading.value = "noMore";
      } else {
        loading.value = "More";
      }

      console.log(arr);
    } else {
    }

    console.log(res);
  } catch (e) {}
};

const selectHy = () => {
  uni.navigateTo({
    url: "/pages/cashier/search_sel/index?type=1",
  });
};
const goDet = (item) => {
  uni.navigateTo({
    url: "/pages/cashier/sales_order_det/index?id=" + item.id,
  });
};
const selectdate = ref(-1);
const selectFUN = (index) => {
  let arr = null;

  if (index == 1) {
    console.log("今天", getToday());
    arr = getToday();
  }
  if (index == 2) {
    arr = getYesterday();
  }

  if (index == 3) {
    arr = getThisWeek();
  }
  if (index == 4) {
    arr = getLastWeek();
  }

  if (index == 5) {
    arr = getThisMonth();
  }

  if (index == 6) {
    showtime.value = true;
    return;
  }
  form.value.createStartTime = arr.start;
  form.value.createEndTime = arr.end;

  if (selectdate.value == index) {
    form.value.createStartTime = "";
    form.value.createEndTime = "";

    selectdate.value = -1;
  } else {
    selectdate.value = index;
  }

  getAppProductQuery(1);
  // createStartTime: "",
  // createStartTime: "",
};

const searchFun = () => {
  getAppProductQuery(1);
};

//用户店铺
const introData = ref([]);
const selectShopNum = ref(0);
const selectDate = ref([]);
const showShop = ref(false);

const getList = async () => {
  try {
    // 发送请求
    let res = await appInfo({});
    if (res.code == 200) {
      selectDataList.value = [];
      res.data.employees.forEach((item) => {
        item.select = true;
        selectDataList.value.push(item);
      });
      introData.value = [
        { shopName: "全部", shopId: "" },
        ...res.data.employees,
      ];
      selectShopNum.value = res.data.employees.length;
    }
  } catch (e) {
    uni.showToast({
      title: e.info,
      icon: "none",
    });
  }
};
getList();

const selectShop = (item) => {
  item.select = !item.select;
  let num = 0;

  introData.value.forEach((item) => {
    if (item.select) {
      num++;
    }
  });
  selectShopNum.value = num;
  //     introData.value = res.data.employees;
};

const selectDataList = ref([]);

const cancel = () => {
  let num = 0;
  showShop.value = false;

  if (selectDataList.value.length > 0) {
    introData.value.forEach((item2) => {
      item2.select = false;
    });

    selectDataList.value.forEach((item) => {
      introData.value.forEach((item2) => {
        if (item2.shopId == item.shopId) {
          item2.select = true;
          num++;
        }
      });
    });
    selectShopNum.value = num;
  }
};
const qrFun = () => {
  if (selectShopNum.value < 1) {
    return uni.showToast({
      title: "请选择门店",
      icon: "none",
    });
  }
  showShop.value = false;
  selectDataList.value = [];

  introData.value.forEach((item2) => {
    if (item2.select) {
      selectDataList.value.push(item2);
    }
  });

  getDate(1);
};

const cancelfun = () => {
  showtime.value = false;
  selectdate.value = -1;
  form.value.createStartTime = "";
  form.value.createEndTime = "";
  getAppProductQuery(1);
};

const showShopTo = ref(false);
const confirmShop = (index, setLastIndex) => {
  console.log(index, setLastIndex);
  ids.value = index.value[0].shopId;
  shopName.value = index.value[0].shopName;
  showShopTo.value = false;
  getAppProductQuery(1);
};
</script>

<template>
  <view class="bg">
    <top-nav :title="'搜索单据'" :border="false" rType="save"></top-nav>

    <view class="content">
      <view class="content-item">
        <view class="content-item-title"><text>搜索条件</text> </view>
        <view class="content-list">
          <view class="content-list-sel">
            <!-- <view class="content_info_index" @click="selectHy">
              <text class="content_info_index_text">会员</text>
              <view class="bj"
                ><text :class="true ? 'bj-text' : ''">{{
                  true ? "sdassd" : "无备注"
                }}</text>
                <up-icon
                  name="arrow-right"
                  color="#C9CDD4"
                  size="40rpx"
                ></up-icon
              ></view>
            </view> -->

            <view class="content_info_index">
              <text class="content_info_index_text">搜索订单</text>
              <view class="bj">
                <up-input
                  v-model="form.keyword"
                  style="text-align: right"
                  placeholder="请输入内容"
                  border="none"
                  clearable
                ></up-input
              ></view>
            </view>
            <view class="content_info_index" @click="selectHy">
              <text class="content_info_index_text">操作人</text>
              <view class="bj"
                ><text>{{ createByObj.id ? createByObj.name : "去选择" }}</text>
                <up-icon
                  name="arrow-right"
                  color="#C9CDD4"
                  size="40rpx"
                ></up-icon
              ></view>
            </view>

            <view class="content_info_index" @click="showShopTo = true">
              <text class="content_info_index_text">选择店铺</text>
              <view class="bj"
                ><text>{{ shopName ? shopName : "去选择" }}</text>
                <up-icon
                  name="arrow-right"
                  color="#C9CDD4"
                  size="40rpx"
                ></up-icon
              ></view>
            </view>
            <view class="top">
              <view
                class="top-item"
                :class="selectdate == 1 ? 'top-item-select' : ''"
                @click="selectFUN(1)"
                >今天</view
              >
              <view
                class="top-item"
                :class="selectdate == 2 ? 'top-item-select' : ''"
                @click="selectFUN(2)"
                >昨天</view
              >
              <view
                class="top-item"
                :class="selectdate == 3 ? 'top-item-select' : ''"
                @click="selectFUN(3)"
                >本周</view
              >
              <view
                class="top-item"
                :class="selectdate == 4 ? 'top-item-select' : ''"
                @click="selectFUN(4)"
                >上周</view
              >
              <view
                class="top-item"
                :class="selectdate == 5 ? 'top-item-select' : ''"
                @click="selectFUN(5)"
                >本月</view
              >
              <view
                class="top-item"
                :class="selectdate == 6 ? 'top-item-select' : ''"
                @click="selectFUN(6)"
                >自定义</view
              >
            </view>
          </view>
        </view>
      </view>
    </view>

    <view class="sel-bt">
      <up-button
        type="primary"
        @click="searchFun()"
        color="#1679FB"
        text="确认"
      ></up-button>
    </view>

    <view class="content">
      <view class="content-item">
        <view class="content-item-title"
          ><text>搜索结果</text><text>共{{ num }}条数据</text>
        </view>
        <view class="content-list">
          <view
            class="content-list-item"
            @click="goDet(item)"
            v-for="(item, index) in productData"
            :key="index"
          >
            <view class="content-list-item-title"
              ><text>{{ item.productName }} </text>
              <view class="status-text">{{
                item.status == 3 ? "已支付" : "未支付"
              }}</view></view
            >
            <view class="content-list-item-flex">
              <view class="flex-1"
                >订单编号 <text>{{ item.code }}</text>
              </view>
              <view class="flex-2"
                >合计金额 <text>¥{{ item.totalAmount }}</text>
              </view>
            </view>
            <view class="content-list-item-flex">
              <view class="flex-1"
                >下单时间 <text>{{ item.createTime }}</text>
              </view>
              <view class="flex-2"
                >数量合计 <text>{{ item.totalNum }}</text>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>

    <view class="noData" v-if="productData.length <= 0 && loading == 'noMore'">
      <view class="noData-img">
        <image src="@/static/nodate/datas.png" mode="scaleToFill" />
        <view>暂无商品 </view>
      </view>
    </view>
    <view class="loading-form" v-if="loading && productData.length > 0"
      ><van-loading size="24rpx" v-if="loading == 'Loading'"
        ><text class="loading-text">加载中...</text>
      </van-loading>
      <text class="loading-text" v-if="loading == 'More'">加载更多</text>
      <text class="loading-text" v-if="loading == 'noMore'">~没有数据了~</text>
    </view>
  </view>
  <up-datetime-picker
    class="top-center"
    :hasInput="false"
    @close="cancelfun()"
    @confirm="confirmDate"
    @cancel="cancelfun()"
    format="YYYY-MM-DD"
    :show="showtime"
    v-model="timevalue"
    :closeOnClickOverlay="true"
    mode="date"
  >
  </up-datetime-picker>

  <up-popup
    :closeable="true"
    :show="selectShow"
    @close="selectShow = false"
    :safeAreaInsetBottom="true"
    @open="open"
    round="15"
  >
    <view class="popup-content">
      <view class="popup-content-title" @click="showtime = false">取消</view>
      <view class="popup-content-selTop">快捷选择</view>
      <view class="kj-select">
        <view class="kj-select-item kj-select-item-seleect"> 今日 </view>
        <view class="kj-select-item"> 昨日 </view>
        <view class="kj-select-item"> 近7日 </view>
        <view class="kj-select-item"> 本周 </view>
        <view class="kj-select-item"> 本月 </view>
        <view class="kj-select-item"> 上周 </view>
        <view class="kj-select-item"> 上月 </view>
      </view>
      <view class="popup-content-selTop">自定义</view>
      <view class="kj-select">
        <view class="kj-select-item"> 今日 </view>
        <view class="kj-select-item"> 昨日 </view>
        <view class="kj-select-item"> 近7日 </view>
      </view>
      <view class="bt-text"> 报表统计时间:0:00-次日0:00 </view>
    </view>
  </up-popup>

  <up-popup
    :show="showShop"
    mode="bottom "
    @close="cancel"
    :safeAreaInsetBottom="true"
    @open="open"
  >
    <view class="popup">
      <view
        class="popup_item"
        v-for="(item, index) in introData"
        :key="index"
        @click="selectShop(item)"
      >
        <view class="popup_item_left"
          ><text></text> <text>{{ item.shopName }}</text>
        </view>

        <view class="popup_item_right">
          <view class="popup_item_right_o" v-if="!item.select"></view>
          <image
            v-if="item.select"
            src="@/static/manage/select.png"
            mode="scaleToFill"
          />
        </view>
      </view>
      <view style="width: 100%; height: 30rpx"></view>

      <view class="popup_bt">
        <view class="popup_bt_qx" @click="cancel">取消</view>
        <view class="popup_bt_qr" @click="qrFun"
          >确认({{ selectShopNum }})</view
        >
      </view>
    </view>
  </up-popup>

  <up-picker
    @confirm="confirmShop"
    @cancel="showShopTo = false"
    :show="showShopTo"
    :columns="[introData]"
    keyName="shopName"
  ></up-picker>
</template>

<style lang="scss" scoped>
@import "index.scss";
</style>
